<!-- 左侧菜单 -->
<template>
	<!-- 用div解决 The template root requires exactly one element -->
	<div :class="{'showLogo':showLogo}">
		<!-- 引入logo菜单-->
		<logo-menu v-if="showLogo" :collapse="isCollapse"/>
		<!-- 
			default-active:当前激活菜单的 index,$route.path路由里面的地址
			collapse:是否水平折叠收起菜单（仅在 mode 为 vertical 时可用） 默认false
			isCollapse 取值为vuex中所配置的
		-->
		<el-menu 
			:default-active="$route.path"
			:collapse="isCollapse"
			:unique-opened="false"
			:collapse-transition="false"
			
			mode="vertical"
			>
			<!-- <sub-menu v-for="menu in menuList" :key="menu.menuId" :menu="menu" /> -->
			<sub-menu :routes='menuList'></sub-menu>
		</el-menu>
	</div>
</template>
<script>
import { mapGetters } from 'vuex'
import LogoMenu from './logo-menu'
import SubMenu from './sub-menu'
export default{
	name:'NavMenu',
	data(){
		return{
			showLogo:false,
		}
	},
	computed:{
		...mapGetters([
			'sidebar',
			'menuList'
		]),
		isCollapse() {
			return !this.sidebar
		}
	},
	components:{
		LogoMenu,
		SubMenu
	},
	
}
</script>